import resizeUrl from "../../svg/resize.svg?url"
import {set} from "lodash-es"
import {t} from "../../i18n/index"

export default {
    inherit: 'rect', // 继承于 rect 节点
    width: 200,
    height: 200,
    zIndex:1,
    markup: [
      {
        tagName: 'rect', // 标签名称
        selector: 'body', // 选择器
      },
      {
        tagName: 'foreignObject',
        selector: 'labelbox',
        children:[
          {ns:"http://www.w3.org/1999/xhtml",tagName:"textarea",selector:"label"}
        ]
      },
        // {tagName:"rect",selector:"edit"},
      {tagName:"image",selector:"resize"},
    ],
    attrs: {
      body: {
        stroke: '#8f8f8f',
        strokeWidth: 1,
        fill: '#fff',
        rx: 6,
        ry: 6,
        style:"",
      },
      labelbox:{
        refWidth:"100%",
        refHeight:"100%",
      },
      label:{
        value:"aaaaaaaa",
        style:"box-sizing:border-box;padding:16px;width:100%;height:100%;resize:none;border:none;outline:none;box-shadow:none;background:transparent;text:14px;line-height:16px;",
      },
    //   edit:{
    //     ref:"body",
    //     width:10,
    //     height:10,
    //     fill:"#f00",
    //     refX:"100%",
    //     refX2:"-16",
    //     refY:"6",
    //     event:"node:edit"
    //   },
      resize:{
        'xlink:href':resizeUrl,
        width:10,
        height:10,
        yAlign:"bottom",
        xAlign:"right",
        fill:"#f00",
        refX:"100%",
        refY:"100%",
        refX2:-2,
        refY2:-2,
        style:"cursor:se-resize;",
        event:"labels:resize"
      }
    },
    propHooks(metadata: any) {
      const {value} = metadata
      if(value != undefined){
        set(metadata,'attrs.label.placeholder',value)
      }
      return metadata;
    }
  }